import React, { Component } from 'react'

export default class GoodsInfoTable extends Component {
    /**
     * 更新数据
     * @param {Object} goods 商品对象
     */
    updateGoodsInfo = (goods) => {
        this.props.gotoFormInfoEdit(goods);
    }

    /**
     * 删除当前商品
     * @param {String} id 商品的ID
     * @param {String} brand 商品的品牌
     * @param {String} name 商品的名称
     */
    deleteGoodsInfo(id,brand,name) {
        if(window.confirm(`您确定要删除“${brand}-${name}”吗？`)) {
            React.axios.get('/store-manage/common/goods-manage/goods-delete.php', {
                params: {
                    goodsID: id
                }
            }).then(res => {
                alert(res.data);
                // 重新载入数据并重新生成分页按钮
                this.props.setPagingNumGroup();
            });
        }
    }

    render() {
        const goodsInfo  = this.props.goodsInfo;
        return (
            <div>
                <table className="goodsInfo">
                    <thead>
                        <tr>
                            <th>编号</th>
                            <th>品牌</th>
                            <th>名称</th>
                            <th>型号</th>
                            <th>分类</th>
                            <th>入库时间</th>
                            <th>数量</th>
                            <th>单价</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        {goodsInfo.map(goods => (<tr key={goods.goodsID}>
                            <td>{goods.goodsID}</td>
                            <td>{goods.brand}</td>
                            <td>{goods.goodsName}</td>
                            <td>{goods.model}</td>
                            <td>{goods.category}</td>
                            <td>{goods.intoDatetime}</td>
                            <td>{goods.quantity}</td>
                            <td>￥{goods.price}</td>
                            <td>
                                <span>详情</span>
                                <span
                                    onClick={() => {
                                        this.updateGoodsInfo(goods);
                                    }}
                                >修改</span>
                                <span
                                    onClick={() => {
                                        this.deleteGoodsInfo(
                                            goods.goodsID, 
                                            goods.brand, 
                                            goods.goodsName
                                        );
                                    }}
                                >删除</span>
                            </td>
                        </tr>))}
                    </tbody>
                </table>
            </div>
        )
    }
}
